Editor.js

editor.js

제품 정보

favorites 즐겨 찾기에 추가

공개 채팅

지원 계획

현재 사용할 수 있는 OSS 플랜이 없습니다.

저장소의 제공자 또는 기여자인 경우 OSS 플랜 추가를 시작할 수 있습니다.

OSS 플랜 추가
OSS용 PieceX가 처음이신가요 여기에서 자세히 알아보세요

이 오픈소스에 대한 플랜을 찾고 있다면 저희에게 문의해 주세요.

전문 공급자와 연락하실 수 있도록 도와드리겠습니다.

제품 세부 정보

A block-styled editor with clean JSON output

Editor.js Logo

editorjs.io | documentation | changelog

npm Minzipped size Backers on Open Collective Sponsors on Open Collective

## About Editor.js is an open-source text editor offering a variety of features to help users create and format content efficiently. It has a modern, block-style interface that allows users to easily add and arrange different types of content, such as text, images, lists, quotes, etc. Each Block is provided via a separate plugin making Editor.js extremely flexible. Editor.js outputs a clean JSON data instead of heavy HTML markup. Use it in Web, iOS, Android, AMP, Instant Articles, speech readers, AI chatbots — everywhere. Easy to sanitize, extend and integrate with your logic. - 😍  Modern UI out of the box - 💎  Clean JSON output - ⚙️  Well-designed API - 🛍  Various Tools available - 💌  Free and open source Editor.js Overview ## Installation It's quite simple: 1. Install Editor.js 2. Install tools you need 3. Initialize Editor's instance Install using NPM, Yarn, or [CDN](https://www.jsdelivr.com/package/npm/@editorjs/editorjs): ```bash npm i @editorjs/editorjs ``` Choose and install tools: - [Heading](https://github.com/editor-js/header) - [Quote](https://github.com/editor-js/quote) - [Image](https://github.com/editor-js/image) - [Simple Image](https://github.com/editor-js/simple-image) (without backend requirement) - [Nested List](https://github.com/editor-js/nested-list) - [Checklist](https://github.com/editor-js/checklist) - [Link embed](https://github.com/editor-js/link) - [Embeds](https://github.com/editor-js/embed) (YouTube, Twitch, Vimeo, Gfycat, Instagram, Twitter, etc) - [Table](https://github.com/editor-js/table) - [Delimiter](https://github.com/editor-js/delimiter) - [Warning](https://github.com/editor-js/warning) - [Code](https://github.com/editor-js/code) - [Raw HTML](https://github.com/editor-js/raw) - [Attaches](https://github.com/editor-js/attaches) - [Marker](https://github.com/editor-js/marker) - [Inline Code](https://github.com/editor-js/inline-code) See the [😎 Awesome Editor.js](https://github.com/editor-js/awesome-editorjs) list for more tools. Initialize the Editor: ```html
``` ```javascript import EditorJS from '@editorjs/editorjs' const editor = new EditorJS({ tools: { // ... your tools } }) ```` See details about [Installation](https://editorjs.io/getting-started/) and [Configuration](https://editorjs.io/configuration/) at the documentation. ### Saving Data Call `editor.save()` and handle returned Promise with saved data. ```javascript const data = await editor.save() ``` ### Example Take a look at the [example.html](example/example.html) to view more detailed examples. ## Roadmap - Unified Toolbox - [x] Block Tunes moved left - [x] Toolbox becomes vertical - [x] Ability to display several Toolbox buttons by the single Tool - [x] Block Tunes become vertical - [ ] Block Tunes support nested menus - [ ] Conversion Toolbar uses Unified Toolbox - [ ] Conversion Toolbar added to the Block Tunes - Collaborative editing - [ ] Implement Inline Tools JSON format - [ ] Operations Observer, Executor, Manager, Transformer - [ ] Implement Undo/Redo Manager - [ ] Implement Tools API changes - [ ] Implement Server and communication - [ ] Update basic tools to fit the new API - Other features - [ ] Blocks drag'n'drop - [ ] New cross-block selection - [ ] New cross-block caret moving - Ecosystem improvements - [x] CodeX Icons — the way to unify all tools and core icons - [x] New Homepage and Docs - [x] @editorjs/create-tool for Tools bootstrapping - [ ] Editor.js DevTools — stand for core and tools development - [ ] Editor.js Design System - [ ] Editor.js Preset Env - [ ] Editor.js ToolKit - [ ] New core bundle system - [ ] New documentation and guides Support Editor.js
## Like Editor.js? You can support project improvement and development of new features with a donation to our team. [Donate via OpenCollective](https://opencollective.com/editorjs) \ [Donate via Crypto](https://codex.so/donate) \ [Donate via Patreon](https://www.patreon.com/editorjs) ### Why donate Donations to open-source products have several advantages for your business: - If your business relies on Editor.js, you'll probably want it to be maintained - It helps Editor.js to evolve and get the new features - We can support contributors and the community around the project. You'll receive well organized docs, guides, etc. - We need to pay for our infrastructure and maintain public resources (domain names, homepages, docs, etc). Supporting it guarantees you to access any resources at the time you need them. - You can advertise by adding your brand assets and mentions on our public resources ### Sponsors Support us by becoming a sponsor. Your logo will show up here with a link to your website.

Mister Auto UPLUCID, K.K. Kane Jamison Content Harmony

[Become a Sponsor](https://opencollective.com/editorjs/contribute/sir-8679/checkout) ### Backers Thank you to all our backers [Become a Backer](https://opencollective.com/editorjs/contribute/backer-8632/checkout) ### Contributors This project exists thanks to all the people who contribute.

### Need something special? Hire CodeX experts to resolve technical challenges and match your product requirements. - Resolve a problem that has high value for you - Implement a new feature required by your business - Help with integration or tool development - Provide any consultation Contact us via team@codex.so and share your details ## Community - [Official Tools](https://github.com/editor-js) - [Awesome Editor.js](https://github.com/editor-js/awesome-editorjs) - [Good First Tasks](https://github.com/codex-team/editor.js/issues?q=is%3Aopen+is%3Aissue+label%3A%22good+first+task%22) - [Contributing](https://editorjs.io/contributing/) - [Telegram Chat](https://t.me/codex_editor) # About CodeX CodeX is a team of digital specialists around the world interested in building high-quality open source products on a global market. We are [open](https://codex.so/join) for young people who want to constantly improve their skills and grow professionally with experiments in cutting-edge technologies. | 🌐 | Join 👋 | Twitter | Instagram | | -- | -- | -- | -- | | [codex.so](https://codex.so) | [codex.so/join](https://codex.so/join) |[@codex_team](http://twitter.com/codex_team) | [@codex_team](http://instagram.com/codex_team/) |
user-symbol

문의하기

비즈니스 개발자를 위한 최신 정보를 원하십니까? 소스 코드 프로젝트에 대한 PieceX 커뮤니티의 요구사항을 알아보세요. PieceX의 최신 무료 커뮤니티 코드를 빠르게 알려드립니다.